// 组织数据
var textArray = ["红","绿","蓝","黄","紫"];
var colorArray = ["red","green","blue","yellow","purple"];

// 获取页面中的标记
var timeEle = document.querySelector(".time");
var scoreEle = document.querySelector(".score");
var contentDiv = document.querySelector(".content");
var spans = document.querySelectorAll(".footer>span");

// 正确答案
var currentAnswer = "blue";
// 默认分数
var currentScore = 0;
// 总时间
var totalTime = 60;

// 修改页面中的内容
function changeShowContent(){
	// 1.修改 contentDiv 中的内容，以及字体颜色
		/*
			innerHTML 表示标记中的内容
		*/ 
		// textRandomIndex 文字的随机索引
		var textRandomIndex = createRandomNum(0,textArray.length - 1);
		contentDiv.innerHTML = textArray[textRandomIndex];

		// colorRandomIndex 颜色的随机索引
		var colorRandomIndex = createRandomNum(0,colorArray.length - 1);
		var currentColor = colorArray[colorRandomIndex];
		contentDiv.style.color = currentColor;

		// 更改正确答案
		if (currentColor == "red") {
			currentAnswer = "红";
		}else if (currentColor == "green") {
			currentAnswer = "绿";
		}else if (currentColor == "blue") {
			currentAnswer = "蓝";
		}else if (currentColor == "yellow") {
			currentAnswer = "黄";
		}else if (currentColor == "purple") {
			currentAnswer = "紫";
		}


	// 2.修改 spans 中每一个 span 的内容 和 字体颜色
		// console.log(textArray);
		breakArray(textArray);
		// console.log(textArray);
		breakArray(colorArray);
		for (var i = 0; i < spans.length; i++) {
			spans[i].innerHTML = textArray[i];
			spans[i].style.color = colorArray[i];
		}
}


changeShowContent();



// 判断用户点击的答案是否正确
function checkoutAnswer(ele){
	// ele 是 当前点击的 span
	// console.log(ele.innerHTML);

	if (ele.innerHTML == currentAnswer) {
		// 回答正确
		// 加分
		currentScore++;
		scoreEle.innerHTML = currentScore;
		// 更改页面
		changeShowContent();
	}else{
		// 回答错误
		// 减分

		// 更改页面

	}
}

// 倒计时
var intervalId;
function calcTime(){
	intervalId = setInterval(function(){
		// totalTime 减 1 
		totalTime--;
		timeEle.innerHTML = totalTime;

		if (totalTime <= 0) {
			// 游戏结束
			// alert("游戏结束, 得分" + currentScore); 

			var myAlert = document.querySelector("#myAlert");
			myAlert.style.display = "flex";
			myAlert.innerHTML = "游戏结束, 得分" + currentScore;

			// 清除计时器
			clearInterval(intervalId);
		}
	},1000);
}


// 重新开始
function reStart(){
	// 默认分数
	currentScore = 0;
	scoreEle.innerHTML = currentScore;
	// 总时间
	totalTime = 60;
	timeEle.innerHTML = totalTime;

	var myAlert = document.querySelector("#myAlert");
	myAlert.style.display = "none";

	// 更改页面中的内容
	changeShowContent();

	// 开始计时
	calcTime();
}

reStart();






// 打乱数组
function breakArray(arr){
	// arr.sort(function(){
	// 	if (Math.random() > 0.5) {
	// 		return  1;
	// 	}else{
	// 		return -1;
	// 	}
	// });

	for (var i = 0; i < arr.length; i++) {
		var randomIndex = createRandomNum(0,arr.length - 1);
		var temp = arr[randomIndex];
		arr[randomIndex] = arr[i];
		arr[i] = temp;
	}
}





// 随机产生一个数字 取值范围 [m,n]
function createRandomNum(m,n){
	/*
		Math.random()		取值范围 [0,1)
		Math.floor(num)		向下取整		1.999 -> 1
		Math.ceil(num)		向上取整		1.001 -> 2 
	*/ 
	var randomNum = Math.floor(Math.random() * (n - m + 1)) + m;
	return randomNum;
}